<template>
  <ul>
    <li v-for="(item,index) in historyList" :key="item.id" style="border-bottom: 1px solid #eee;padding: 10px;">
      <span>{{ index+1 }}.</span>
      <span>{{ item.closeIssue === 0 ? item.closeTime : item.recordTime }},</span>
      <span>由<span style="font-weight:bold">{{ item.closeIssue === 0 ? item.closeUserName : item.testerName }}</span>记录，{{isBug ? '缺陷' : '漏洞'}}状态为<span style="font-weight:bold">{{statusEscape(item.vulnerablilityStatus || item.bugStatus)}}</span>。</span>
      <span style="cursor: pointer;font-size: 20px;">
       <Icon @click.native="closeItem(item)" class="icon-btn" type="ios-arrow-up" v-if="item.open==true"/>
       <Icon @click.native="openItem(item)" class="icon-btn" type="ios-arrow-down" v-else/>
      </span>
      <div v-if="item.open">
        <!-- 需求变更，见与罗姐2023/9/6 9:49微信聊天记录，只展示当前状态与说明，其他内容全部屏蔽 -->
        <!-- <div class="flex">
          <div><span class="label">测试项目</span>： {{ item.testProjectName || '-' }}</div>
          <div><span class="label">测试事务</span>： {{ item.testTransactionName || '-' }}</div>
          <div><span class="label">测试项</span>： {{ item.testItemName || '-' }}</div>
          <div><span class="label">测试用例</span>： {{ item.testItemCaseName || '-' }}</div>
          <div><span class="label">使用工具</span>： {{ item.toolName || '-' }}</div>
          <div><span class="label">日志状态</span>： {{ closeIssueEscape(item.closeIssue, isBug).text }}</div>
        </div> -->
        <div><span class="label">说明</span>： {{ item.memo }}</div>
        <div v-if="item.fileId">
          <span class="label">附件</span>： <a :href="`/api/minio/download/${item.fileId}`" :download="item.fileName">{{ item.fileName }}</a>
        </div>
      </div>
    </li>
  </ul>
</template>

<script>

import {queryVulnerabilityLogList} from '../api/vulnerability'
import * as vulnerabilityLogic from '../logic/vulnerabilityLogic'
export default{
  name:'historyPage',
  props:{
    isBug: {
      type: Boolean,
      default: false
    }
  },
  data(){
    return{
      historyList:[],
      queryParams:{
        pageIndex:1,
        pageSize:2147483646
      }
    }
  },
  methods:{
    openItem(item){
      this.$set(item,'open',true)
    },
    closeItem(item){
      this.$set(item,'open',false)
    },
    previewDetail(params){
      this.$emit('detailItem',params)
    },
    statusEscape(status) {
      let fn = this.isBug ? vulnerabilityLogic.bugStatusEscape : vulnerabilityLogic.vulnerabilityStatusEscape
      return fn(status).text
    },
    // 查询缺陷或者漏洞列表
    getBugLogOrVulnerabilityLogList(data) {
      let params = {...this.queryParams}
      params.vulnerabilityId = data.id;
      queryVulnerabilityLogList(params).then(res => {
        let { code, message } = res
        if (code !== 1) {
          this.$Message.warning(message)
          return
        }
        let datas = res.data || {}
        this.historyList = (datas.items || []).map(item => {
          item.name = data.name
          item.productName = data.productName
          return item
        })
      }).catch(() => {
        this.$Message.error(`获取${data.name}日志列表异常`)
      }).finally(() => {
      })
    },
  }
}
</script>

<style scoped>
.flex {
  display: flex;
  flex-wrap: wrap;
}
.flex > div {
  width: 33%;
  min-width: 300px;
}
/* .label {
  display: inline-block;
  width: 66px;
  text-align: justify;
  text-justify:distribute-all-lines;
  text-align-last: justify;
} */
.icon-btn {
  cursor: pointer;
}
.icon-btn:hover {
  color: #2b85e4;
}
</style>
